<template>
  <div class="dataCard">
    <el-space>
      <div class="card">
        <div class="title">班级总人数</div>
        <div class="data">{{ data.totalPeople }}</div>
      </div>
      <div class="card">
        <div class="title">班级总人数</div>
        <div class="data">{{ data.totalPeople }}</div>
      </div>
      <div class="card">
        <div class="title">班级总人数</div>
        <div class="data">{{ data.totalPeople }}</div>
      </div>
    </el-space>
  </div>
</template>
<script setup lang="ts">
import { ref } from 'vue'

const data = ref({
  totalPeople: 68,
  absentPeople: 0,
  currentPeople: 68,
})
</script>
<style scoped lang="scss">
.dataCard {
  width: 100%;
  .card {
    display: flex;
    flex-direction: column;
    background: #171717;
    color: white;
  }
}
</style>
